<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Liste des Salles</title>
	<link rel="stylesheet" type="text/css" href="Script/style.css" />
	<link rel="stylesheet" type="text/css" href="Script/formulaire-css3.css" media="screen" title="bbxcss" />
	<script type="text/javascript" src="Script/jquery-1.6.1.min.js"></script>
	<script type="text/javascript" src="Script/jquery-latest.js"></script>
	<script type="text/javascript" src="Script/jquery.tablesorter.js"></script>

	<script type="text/javascript">
		$(document).ready(function() 
	    { 
	        $("#table").tablesorter(); 
	    } 
	); 
		$(document).ready(function() {
			if(document.getElementById('state').value != "-1")
			{
				$("#step1").fadeOut(1500,function()
				{
					document.getElementById('step2').style.visibility = "visible";
					$("#step2").hide().fadeIn(1500);		
				});
			}
		});
	</script>
</head>

<body>
		<form>
			<fieldset>
				<p align="center"><u><b>GESTION DES SALLES</b></u></p>
		    </fieldset>
		</form>	
		
	<div id="step1"> 		
		<h:form>
			<!-- 
				Utiliser le composant JSF DataTable pour afficher le numéro et la capacité des salles contenus dans la table
				On récupère les salles avec la fonction allMovies() de la classe MovieManagedBean
		 	-->
			<h:dataTable id="table" styleClass="tablesorter" value="#{salleManagedBean.allSalle()}" var="salle">
		    	<h:column>
		    		<f:facet name="header">Numéro</f:facet>
		    		<!-- Affiche le numéro de la salle en sortie -->
		        	<h:outputText value="#{salle.numero}" />
		    	</h:column>
				<h:column>
		    		<f:facet name="header">Capacité</f:facet>
		    		<!-- Affiche le nombre de place disponible de la salle en sortie -->
		        	<h:outputText value="#{salle.capacite}" />
		    	</h:column>
		    	<h:column>
		    		<!-- 
        				On supprime la salle avec la fonction deleteSalle() de la classe SubscriberManagedBean en récupérant la salle
        			-->
		    		<f:facet name="header">Supprimer</f:facet>
		    		<h:commandLink value="X" action="#{salleManagedBean.deleteSalle(salle)}"></h:commandLink>
		    	</h:column>
		    	<h:column>
			    	<!-- 
	        			On modifie la salle avec la fonction setSalle() de la classe SubscriberManagedBean, en récupérant la salle
	        			la div contenant les champs a modifier deviendra visible
	        		-->
		    		<f:facet name="header">Modifier</f:facet>
		    		<h:commandLink value="Modifier" action="#{salleManagedBean.setSalle(salle)}"></h:commandLink>
		    	</h:column>
			</h:dataTable>
		</h:form>
	</div> 	
	<h:inputHidden id="state" value="#{salleManagedBean.numero}" />
	<div id="step2" style="visibility: hidden">
		<h:form>
        	<fieldset>
		      	<p>
		       	 	<label>NUMERO</label>
		       	 	<!-- 
        				On récupère le numéro de la salle à modifier que l'admin a écrit
        		 	-->
		      		<h:inputText class="movie_fields" value="#{salleManagedBean.salle.numero}" />
		      	</p>
		        <p>        
		        	<label>CAPACITE</label>
		        	<!-- 
        			On récupère la capacité(nombre de place totale) de la salle que l'admin a écrit
        		 	-->
		        	<h:inputText id="movie_fields" class="movie_fields" value="#{salleManagedBean.salle.capacite}" />
		        </p>
		        <p align="right">
		        <!-- 
        			On modifie la salle avec la fonction modifySalle() de la classe SalleManagedBean
        			Ce managed bean peut demander l'injection du bean salle de façon à pouvoir examiner les champs entrés par l'admin.
        	 	-->
	        	 <h:commandButton value="MODIFIER" action="#{salleManagedBean.modifySalle}" />         
	         	</p>   
    		</fieldset>
    	</h:form>
    </div>
</body>
</html>